
<template>
    <span contenteditable="true" style="outline:none;width:20px" ref="addDescMore" id="addDescMore"
         v-html="innerText"
         @focus="clearHtml"
         @blur="changeText"></span>
</template>
<script>
    export default {
        props: ['value'],
        data(){
            return {innerText:this.value}
        },
        methods:{
            changeText(){
                this.innerText = this.$el.innerHTML;
                this.$emit('input',this.innerText);
                this.innerText = ' ';
            },
            clearHtml(){
                this.innerText = ' ';
                this.$refs.addDescMore.textContent=" ";
            },
        }
    }
</script>
